<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

    <head>
        <meta charset="utf-8" />
        <title>会议管理</title>
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <meta content="Premium Multipurpose Admin & Dashboard Template" name="description" />
        <meta content="" name="author" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />

        <!-- App favicon -->
        <link rel="shortcut icon" href="../assets/images/favicon.ico">

        <link href="../../plugins/summernote/summernote-bs4.css" rel="stylesheet" />

        <!-- App css -->
        <link href="../assets/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
        <link href="../assets/css/jquery-ui.min.css" rel="stylesheet">
        <link href="../assets/css/icons.min.css" rel="stylesheet" type="text/css" />
        <link href="../assets/css/metisMenu.min.css" rel="stylesheet" type="text/css" />
        <link href="../assets/css/app.min.css" rel="stylesheet" type="text/css" />

    </head>

    <body>

    <!-- Top Bar Start -->
    <div th:replace="~{common/top-nav::top-nav}"></div>
    <!-- Top Bar End -->


    <!-- Left Sidenav -->
    <div th:replace="~{common/left-side-nav::left-side-nav}"></div>
    <!-- end left-sidenav-->

        <div class="page-wrapper">

            <!-- Page Content-->
            <div class="page-content">

                <div class="container-fluid">
                    <!-- Page-Title -->
                    <div class="row">
                        <div class="col-sm-12">
                            <div class="page-title-box">
                                <div class="float-right">
                                    <ol class="breadcrumb">
                                        <li class="breadcrumb-item"><a href="javascript:void(0);">办公自动化</a></li>
                                        <li class="breadcrumb-item"><a href="javascript:void(0);">会议管理</a></li>
                                        <li class="breadcrumb-item active">会议管理</li>
                                    </ol>
                                </div>
                                <h4 class="page-title">管理会议</h4>
                            </div><!--end page-title-box-->
                        </div><!--end col-->
                    </div>
                    <!-- end page title end breadcrumb -->

                    <div class="row">
                        <div class="col-12">




                                <div class="card mt-3">
                                    <div class="card-body">

                                        <form class="form-inline mb-3"
                                              th:action="@{/meeting/meeting1}" method="get">
                                            <input name="pageSize" th:value="${page.pageSize}" type="hidden"/>
                                            <div class="form-group">
                                                <label class="sr-only" for="keyword">搜索</label>
                                                <input type="text" class="form-control" id="keyword" th:value="${param.keyword}"
                                                       name="keyword" placeholder="请输入关键字">
                                            </div>
                                            <button type="submit" class="btn btn-gradient-primary ml-4">搜索</button>
                                            <button id="clearBtn" type="button" class="btn btn-gradient-danger ml-4" >清除</button>
                                            <p></p>
                                            <div class="table-responsive">
                                                <table class="table  table-bordered" id="makeEditable">
                                                    <thead>
                                                    <tr>
                                                        <th>序号</th>
                                                        <th>会议主题</th>
                                                        <th>会议备注</th>
                                                        <th>开始时间</th>
                                                        <th>结束时间</th>
                                                        <th>发起时间</th>
                                                        <th>发起人ID</th>
                                                        <th>会议状态</th>
                                                        <th name="buttons">操作</th>
                                                    </tr>
                                                    </thead>
                                                    <tbody>
                                                    <tr th:each="meeting : ${page.list}">
                                                        <td th:text="${meetingStat.count}"></td>
                                                        <td th:text="${meeting.subject}"></td>
                                                        <td th:text="${meeting.remark}"></td>
                                                        <td th:text="${meeting.beginTime}"></td>
                                                        <td th:text="${meeting.endTime}"></td>
                                                        <td th:text="${meeting.launchTime}"></td>
                                                        <td th:text="${meeting.launchUserId}"></td>
                                                        <td th:text="${meeting.status}"></td>
                                                        <td name="buttons" >
                                                            <div class=" pull-left">
                                                                <a th:href="@{/meeting/meeting_modify(id=${meeting.id},pageSize=${page.pageSize},pageNum=${page.pageNum},keyword=${param.keyword})}" class="mr-2">
                                                                    <button id="bEdit" type="button" class="btn btn-sm btn-soft-success btn-circle mr-2" onclick="rowEdit(this);">
                                                                        <i class="dripicons-pencil"></i>
                                                                    </button>
                                                                </a>
                                                                <a th:href="@{/meeting/meeting_remove(id=${meeting.id},pageSize=${page.pageSize},pageNum=${page.pageNum},keyword=${param.keyword})}">
                                                                    <button id="bElim" type="button" class="btn btn-sm btn-soft-danger btn-circle" onclick="rowElim(this);">
                                                                        <i class="dripicons-trash" aria-hidden="true"></i>
                                                                    </button>
                                                                </a>

                                                                <button id="bCanc" type="button" class="btn btn-sm btn-soft-info btn-circle" style="display:none;" onclick="rowCancel(this);">
                                                                    <i class="dripicons-cross" aria-hidden="true"></i>
                                                                </button>
                                                            </div>
                                                        </td>
                                                    </tr>
                                                    </tbody>
                                                </table>

                                            </div>
                                        </form>
                                        <span class="float-right">
                                                    <a th:href="@{/meeting/meeting_add}">
                                                    <button id="but_add" class="btn btn-danger">添加新会议</button></a>
                                                </span><!--end table-->
                                        <div class="row mt-3">
                                            <div class="col-sm-6">
											<span class="align-middle">
												共<span th:text="${page.total}"></span>条，每页显示
												<select th:id="page-size-select" th:remove="all-but-first">
													<option th:each="pageSize : ${#numbers.sequence(5,30,5)}"
                                                            th:text="${pageSize}"
                                                            th:selected="${pageSize} == ${page.pageSize}"></option>
													<option>5</option>
													<option>10</option>
													<option>15</option>
												</select>条数据
											</span>
                                            </div>
                                            <div class="col-sm-6">
                                                <nav aria-label="Page navigation example">
                                                    <ul class="pagination justify-content-end">
                                                        <li th:class="${page.isFirstPage} ? 'page-item disabled' : 'page-item'">
                                                            <a class="page-link"
                                                               th:href="@{/meeting/meeting_list(pageNum=${page.pageNum}-1,pageSize=${page.pageSize}, keyword=${param.keyword})}">上一页</a>
                                                        </li>
                                                        <li th:class="${pageNum} == ${page.pageNum} ? 'page-item active' : 'page-item'"
                                                            th:each="pageNum : ${#numbers.sequence(1,page.pages,1)}">
                                                            <a class="page-link"
                                                               th:text="${pageNum}"
                                                               th:href="@{/meeting/meeting_list(pageNum=${pageNum},pageSize=${page.pageSize},keyword=${param.keyword})}">1</a>
                                                        </li>

                                                        <li th:class="${page.isLastPage} ? 'page-item disabled' : 'page-item'">
                                                            <a class="page-link"
                                                               th:href="@{/meeting/meeting_list(pageNum=${page.pageNum}+1,pageSize=${page.pageSize},keyword=${param.keyword})}">下一页</a>
                                                        </li>
                                                    </ul>
                                                </nav>
                                            </div>


                                        </div><!--end card-body-->
                                    </div>
                                </div>

                        </div><!-- end Col -->
                    </div><!-- End row -->
                </div><!-- container -->

                <!-- Modal -->



                <footer class="footer text-center text-sm-left">
                    &copy; 2022办公自动化 <span class="text-muted d-none d-sm-inline-block float-right"><i class="mdi mdi-heart text-danger"></i> 来自 <a href="#">4228</a></span>
                </footer><!--end footer-->
            </div>
            <!-- end page content -->
        </div>
        <!-- end page-wrapper -->

        


        <!-- jQuery  -->
        <script src="../assets/js/jquery.min.js"></script>
        <script src="../assets/js/bootstrap.bundle.min.js"></script>
        <script src="../assets/js/metismenu.min.js"></script>
        <script src="../assets/js/waves.js"></script>
        <script src="../assets/js/feather.min.js"></script>
        <script src="../assets/js/jquery.slimscroll.min.js"></script>
        <script src="../assets/js/jquery-ui.min.js"></script>

        <script src="../../plugins/summernote/summernote-bs4.min.js"></script>

        <!-- App js -->
        <script src="../assets/js/app.js"></script>
    <script>
        // 当下拉列表框发生改变时，向后台发送请求
        // document.getElementById("page-size-select").addEventListener("change",function (event) {
        //
        // })
        $('#page-size-select').change(function (event){
            // 通过this对象，获得当前选择的值
            var pageSize = $(this).val();
            var keyword = $('#keyword').val()
            // 向服务器发送请求
            window.location = '/jobLogin/jobLogin_list?pageNum=1&pageSize=' + pageSize +'&keyword='+ keyword;

        })

        // 为清除按钮注册事件
        $('#clearBtn').click(function (event){
            // 通过this对象，获得到当前选择的值
            var pageSize = $('#page-size-select').val();
            // 向服务器发送请求
            window.location = '/jobLogin/jobLogin_list?pageNum=1&pageSize=' + pageSize;
        })

        // 为删除按钮注册单击事件
        $('.removeBtn').click(function (event){
            // 如果在<a> 上的单击事件处理器函数返回false，就会进<a>的默认行为
            return confirm('是否要删除？');
        })
    </script>
    </body>

</html>